<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>rectangle</title>
   <link rel="stylesheet" href="./layout.css"/>
</head>
<body>
<div id="main">
  <label >宽度</label>
  <input type="text" id="width" autofocus ><span>*</span><br>
  <div id="width-validate"></div>
  <label >高度</label>
  <input type="text" id="height"><span>*</span><br>
  <div id="height-validate"></div>
  <input type="button" id="calc" value="计算">
  <br>
  <label >周长</label>
  <input type="text" id="perimeter" disabled>
  <br>
  <label >面积</label>
  <input type="text" id="area" disabled>
  <br>
</div>
<div>
  <a href="http://wanglin112.gitee.io/rectangle/1-validate/index.html">表单级校验</a>
  <a href="http://wanglin112.gitee.io/rectangle/2-validate/index.html">字段级校验</a>
  <a href="http://wanglin112.gitee.io/rectangle/3-validate/index.html">字符级校验</a>
</div>
  <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
  <script src="./a.js"></script>
</body>
</html>
